<?php 
    include_once 'inc/function.php';
    include_once 'inc/db.class.php';
	//zzz  
?>
<!DOCTYPE html>
<html>

<head lang="en">
	<?php include_once 'meta.php'; ?>
	<meta name="format-detection" content="telephone=no">
	<meta name="renderer" content="webkit">
	<meta http-equiv="Cache-Control" content="no-siteapp" />
	<link rel="stylesheet" href="assets/css/amazeui.min.css" />
	<link href="css/dlstyle.css" rel="stylesheet" type="text/css">
	<style>
         form>div>label:nth-child(3){
         	width:100px;
         	color:Red;
         	left:180px;
         	font-size:12px;
         }
    </style>
	<script src="http://static.runoob.com/assets/jquery-validation-1.14.0/lib/jquery.js"></script>
	<script src="http://static.runoob.com/assets/jquery-validation-1.14.0/dist/jquery.validate.min.js"></script>
	<script src="http://static.runoob.com/assets/jquery-validation-1.14.0/dist/localization/messages_zh.js"></script>
	<script src="layer/layer.js"></script>
	<script src="assets/js/amazeui.min.js"></script>
	<script src="js/jquery.serializejson.js"></script>
	
	<script>
		$.validator.setDefaults({
			submitHandler: function() {
				 if(!$("#reader-me-1").prop("checked")){
	    				layer.msg("同意协议后才能继续注册",{icon:6});
	    				//alert("同意协议后才能继续注册");
	    				return;
	    		  }
				 //alert(JSON.stringify($('#form1').serializeJSON()));
	    		  //判断当前邮箱是否被注册
	    		  $.ajax({
						url:"ajax/reg.php",
						type:"post",
						data:$('#form1').serializeJSON(),
						success:function(data){
							if(data==0){
		    					layer.msg("邮箱不能为空");
		    				}else if(data==1){
		    					layer.msg("邮箱已经被注册,请您换一个");
		    				}else if(data==2){
		    					layer.msg("注册成功",{icon:6});
		    					setTimeout(function(){
		    						location.href='login.php';
		    					},2000);
		    				}else if(data==3){
		    					layer.msg("注册失败3");
		    				}else{
		    					layer.msg("服务器错误");
		    				}
		    			},
		    			error:function(){
		    				layer.msg("sorry,注册失败!",{icon:2});
		    			}
		    		  });
		    		}
		    	});
		$().ready(function() {
			$("#form1").validate({
				rules:{
					email:{
						required:["email",true]
					},
					userpwd:{
						required:true,
						ckpwd:true    // 检测是否符合正则
					},
					reuserpwd:{   
						required:true,
						equalTo:"#userpwd"
					},
					
				},
				messages:{
					email:"填写有效邮箱",
					userpwd:"密码格式不正确",
					reuserpwd:{
						required:"	请输入重复密码",
						equalTo:"两次密码不一致"
					},
				},
			});
			$.validator.addMethod("ckpwd",function(value){
				var preuser = /^[a-z0-9A-Z_]{5,18}$/;
				return preuser.test(value);},"*请输入正确的密码！");  
		});	

		$(document).ready(function(){
			$("#phone").blur(function(){
				$.ajax({
					url:"ajax/cktel.php",
					type:"post",
					data:{"tel":$(this).val()},
					success:function(data){
						if(data==0){
							layer.msg("请输入正确的手机号",{icon:5});
							return ;
						}else if(data==1){
							layer.msg("该手机号已经被注册",{icon:5});
							return ;
						}else if(data==2){
							$("#dyMobileButton").bind("click",fun1);
						}else{
							layer.msg("系统错误",{icon:5});
							return ;
						}
					},
					error:function(){	
						layer.msg("ERROR",{icon:5});
						return ;
					}
				});
			});
		});

		
	    var fun1;
	    fun1=function(){
			//判断填写是否是正确手机号
			var pre=/^1[3456789]\d{9}$/;
			if(!pre.test($("#phone").val())){
				layer.msg("请输入正确的手机号",{icon:5});
				return ;
			}
			//手机号如果正确name发送短信验证码同时手机号文本框变成只读
			$("#phone").prop("readonly",true);
			var v=12;
			$(this).text(v);
			
			//ajax发送短信
			
			$.ajax({
				url:"ajax/sms.php",
				type:"post",
				data:{"tel":$("#phone").val()},
				dataType:"json",
				success:function(data){
					if(data['code']=="000000"){
						mytel=data['mobile'];
						myyzm=data['uid'];
						layer.msg("验证码已下发",{icon:6});
						
					}else{
						layer.msg("短信下发失败",{icon:5});
					}
					
				},
				error:function(){
					layer.msg("系统故障短信下发失败",{icon:5});
				}
			});

			
			
			
			$(this).unbind("click");
			var timer=setInterval(function(){
				if($("#dyMobileButton").text()==0){
					clearInterval(timer);
					$("#dyMobileButton").text("获取");
					$("#dyMobileButton").bind("click",fun1);
					return;
				}
				$("#dyMobileButton").text($("#dyMobileButton").text()-1);
			},1000);
		}
	    //手机号 验证码
	    var mytel="";
	    var myyzm="";
	    $(document).ready(function(){
			
			//手机号注册单击事件
			$("#telreg").click(function(){
				//判断格式
				var pre=/^1[3456789]\d{9}$/;
				var pre2=/^[a-zA-Z0-9_]{5,18}$/;
				if(!pre.test($("#phone").val())){
					layer.msg("手机号格式错误",{icon:5});
					return;
				}
				if(!pre2.test($("#userpwd2").val())){
					layer.msg("密码格式错误",{icon:5});
					return;
				}
				//判断两次密码
				if($("#userpwd2").val()!=$("#reuserpwd2").val()){
					layer.msg("两次密码输入不一致",{icon:5});
					return;
				}

				//判断手机号是否是下发短信手机号
				if($("#phone").val()!=mytel){
					layer.msg("输入手机号与下发短信手机号不一致",{icon:5});
					return;
				}
				
				//验证码是否正确
				if($("#code").val()!=myyzm){
					layer.msg("验证码输入错误",{icon:5});
					return;
				}

				//必须同意协议
				if(!$("#reader-me-2").prop("checked")){
					layer.msg("请您同意协议后再注册",{icon:5});
					return;
				}
				
				//ajax注册
				$.ajax({
					url:"ajax/reg.php",
					type:"post",
					data:{"tel":$("#phone").val(),"userpwd":$("#userpwd2").val(),"flag":"tel"},
					success:function(data){
						if(data==1){
							layer.msg("恭喜，注册成功！",{icon:6});
							setTimeout(function(){
								location.href="login.php";
							},2000);
						}else if(data==2){
							layer.msg("sorry，注册失败！",{icon:5});
						}else{
							layer.msg("sorry，注册失败！",{icon:5});
						}
					},
					error:function(){
						layer.msg("系统故障，注册失败",{icon:5});
					}
				});
				
			});
		});
	</script>
</head>

<body>

	<div class="login-boxtitle">
		<a href="index.php"><img alt="" src="images/<?php echo $web["logo"]; ?>" /></a>
	</div>

	<div class="res-banner">
		<div class="res-main">
			<div class="login-banner-bg"><span></span><img src="images/big.jpg" /></div>
			<div class="login-box">

					<div class="am-tabs" id="doc-my-tabs">
						<ul class="am-tabs-nav am-nav am-nav-tabs am-nav-justify">
							<li class="am-active"><a href="">邮箱注册</a></li>
							<li><a href="">手机号注册</a></li>
						</ul>

						<div class="am-tabs-bd">
							<div class="am-tab-panel am-active">
								<form id="form1" method="post">
									
								<div class="user-email">
									<label for="email"><i class="am-icon-envelope-o"></i></label>
									<input type="email" name="email" id="email" placeholder="请输入邮箱账号">
								</div>										
								<div class="user-pass">
									<label for="password"><i class="am-icon-lock"></i></label>
									<input type="password" name="userpwd" id="userpwd" placeholder="设置密码">
								</div>										
								<div class="user-pass">
									<label for="passwordRepeat"><i class="am-icon-lock"></i></label>
									<input type="password" name="reuserpwd" id="reuserpwd" placeholder="确认密码">
								</div>	
								<input type="hidden" name="flag"  value="email" />
								</form>
			 
							 <div class="login-links">
									<label for="reader-me-2">
										<input name="agreeProtocol_1" id="reader-me-1" type="checkbox"> 点击表示您同意商城《服务协议》
									</label>
							 </div>
									<div class="am-cf">
										<input form="form1" type="submit" name="" value="注册" class="am-btn am-btn-primary am-btn-sm am-fl">
									</div>

							</div>

							<div class="am-tab-panel">
								<form id="form2" method="post">
			 <div class="user-phone">
								<label for="phone"><i class="am-icon-mobile-phone am-icon-md"></i></label>
								<input type="tel" name="phone" id="phone" placeholder="请输入手机号">
			 </div>																			
									<div class="verification">
										<label for="code"><i class="am-icon-code-fork"></i></label>
										<input type="tel" id="code" placeholder="请输入验证码">
										<a class="btn" href="javascript:void(0);" onclick="" id="sendMobileCode">
											<span id="dyMobileButton">获取</span></a>
									</div>
			 <div class="user-pass">
								<label for="password"><i class="am-icon-lock"></i></label>
								<input type="password" name="" id="userpwd2" placeholder="设置密码">
			 </div>										
			 <div class="user-pass">
								<label for="passwordRepeat"><i class="am-icon-lock"></i></label>
								<input type="password" id="reuserpwd2" placeholder="确认密码">
			 </div>	
			                      <input type="hidden" id="flag" name="flag"  value="tel" />
								</form>
							 <div class="login-links">
									<label for="reader-me-2">
										<input id="reader-me-2" type="checkbox"> 点击表示您同意商城《服务协议》
									</label>
							</div>
									<div class="am-cf">
										<input type="button" name=""  id="telreg" value="注册" class="am-btn am-btn-primary am-btn-sm am-fl">
									</div>
							
								<hr>
							</div>

							<script>
								$(function() {			
									$('#doc-my-tabs').tabs();
								  })
							</script>

						</div>
					</div>

			</div>
		</div>
		</div>
		<?php include_once 'footer.php'; ?>
</body>

</html>